<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>仿搜狗站长平台</title>
    <link rel="stylesheet" href="css/normalize.css" type="text/css">
    <link rel="stylesheet" href="css/index.css" type="text/css">
</head>
<body>
<div id="wrap">
    <!--顶部导航区域-->
    <header>
        <nav class="clearfix">
            <a href="index.html" title="搜狗站长平台" class="logo-link">
                <img src="img/logo.png" alt="搜狗站长平台">
            </a>
            <ul class="nav-list">
                <li><a href="index.html" class="link-hover link-active">首页</a></li>
                <li><a href="#" class="link-hover">网站支持</a></li>
                <li><a href="#" class="link-hover">站长学院</a></li>
                <li><a href="#" class="link-hover">资源合作</a></li>
                <li><a href="#" class="link-hover">站长反馈</a></li>
                <li><a href="#" class="link-hover">用户中心</a></li>
            </ul>
            <ul class="login-box">
                <a href="#" class="link-hover">登录</a>
                <span>|</span>
                <a href="#" class="link-hover">注册</a>
            </ul>
        </nav>
    </header>
    <!--巨幕区域-->
    <div class="jumbotron">
        <div class="box">
            <div class="jumbotron-content">
                <div class="intro">
                    <h2>搜狗站长平台</h2>
                    <p>全面掌握在搜狗搜索中的数据表现</p>
                    <a href="#">立即加入</a>
                </div>
                <div class="jumbotron-img"></div>
            </div>
        </div>
        <div class="announcement">
            <ul>
                <li><a href="#" class="link-hover">[2019-06-13] 匹配网站logo&favicon功能停审下...</a></li>
                <li><a href="#" class="link-hover">[2017-12-30] 搜狗移动搜索页面体验白皮书-广告...</a></li>
                <li><a href="#" class="link-hover">[2017-09-22] 关于搜狗开放适配url匹配需求调查...</a></li>
                <li><a href="#" class="link-hover">更多></a></li>
            </ul>
        </div>
    </div>
    <!--内容区域-->
    <div class="content">
        <section class="site-support">
            <h3>网站支持</h3>
            <ul>
                <li>
                    <div class="icon"></div>
                    <h4>站长工具</h4>
                    <p>通过站长工具优化搜狗对站点的抓取、收录以及搜索结果。</p>
                    <a href="#">查看详情</a>
                </li>
                <li>
                    <div class="icon"></div>
                    <h4>搜索展现</h4>
                    <p>网站地址与适合描述网站匹配，搜索前端展现，自主定义选择。</p>
                    <a href="#">查看详情</a>
                </li>
                <li>
                    <div class="icon"></div>
                    <h4>网站分析</h4>
                    <p>站长平台为您提供准确、快捷的网站收录 数据查询。</p>
                    <a href="#">查看详情</a>
                </li>
                <li>
                    <div class="icon"></div>
                    <h4>站长反馈</h4>
                    <p>您可以向搜狗反馈抓取压力、作弊网站、 收录问题等。</p>
                    <a href="#">查看详情</a>
                </li>
            </ul>
        </section>
        <section class="college">
            <h3>站长学院</h3>
            <ul class="item-list">
                <li>
                    <a href="#" class="topic">
                        <div class="pic-box">
                            <img src="img/college-1.jpg" alt="工具帮助">
                        </div>
                        <h4>工具帮助</h4>
                    </a>
                    <ul class="links-list">
                        <li><a href="#">如何进行网站验证？</a></li>
                        <li><a href="#">开放适配帮助文档</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#" class="topic">
                        <div class="pic-box">
                            <img src="img/college-2.jpg" alt="搜索规范">
                        </div>
                        <h4>搜索规范</h4>
                    </a>
                    <ul class="links-list">
                        <li><a href="#">搜狗搜索页面质量白皮书</a></li>
                        <li><a href="#">· 搜索移动搜索页面体验白皮书</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#" class="topic">
                        <div class="pic-box">
                            <img src="img/college-3.jpg" alt="建站优化">
                        </div>
                        <h4>建站优化</h4>
                    </a>
                    <ul class="links-list">
                        <li><a href="#">网站内容建设的原则是什么？</a></li>
                        <li><a href="#">使搜索引擎对frame和iframe框架是否友好？</a></li>
                    </ul>
                </li>
            </ul>
        </section>
    </div>
    <!--底部信息-->
    <footer>
        <nav class="footer-nav">
            <a href="#" class="link-hover">反馈中心</a>
            <span>|</span>
            <a href="#" class="link-hover">搜狗评级</a>
            <span>|</span>
            <a href="#" class="link-hover">搜狗指数</a>
            <span>|</span>
            <a href="#" class="link-hover">帮助中心</a>
            <span>|</span>
            <a href="#" class="link-hover">联系我们</a>
        </nav>
        <div>
            <span>zhanzhang@sogou-inc.com</span>
            <a href="#">搜狗搜索</a>
        </div>
        <p>Copyright © sogou.com.All Rights Reserved</p>
    </footer>
</div>
</body>
</html>